<template>
	<!-- 20230202 -->
	<view class="mall-my-order-product-refund-list-page">
		<!-- 页面内容 -->
		<view class="page-content">

			<!-- 退款产品 -->
			<view class="bg-ff padding-tb-10 padding-lr-30">
				<jc-mall-orderProducts :list="[orderProduct]"></jc-mall-orderProducts>
			</view>

			<!-- 退款列表 -->
			<view class="margin-top-20 padding-lr-30 bg-ff">
				<view class="padding-tb-30" :class="{'border-bottom-ed': index < refundList.length - 1}" v-for="(item,index) in refundList" :key="index">
					<view class="flex align-center justify-between">
						<view class="flex align-center">
							<view class="text-30">{{item.status_text}}</view>
							<view class="margin-left-15 text-26 text-77">x{{item.refund_number}}</view>
						</view>
						<view class="tex-28 text-main">¥{{item.refund_money}}</view>
					</view>
					<view class="margin-top-20 flex align-center justify-between">
						<view class="text-24 text-aa">申请时间：{{item.show_create_time}}</view>
						<view class="flex align-center" @tap="go('/pages/mall/my/refundDetail?id=' + item.id)">
							<view class="text-26 text-77">查看详情</view>
							<text class="tyIcon-arrow-right text-24 text-4d"></text>
						</view>
					</view>
				</view>
			</view>

		</view>

		<!-- 页面浮层 -->
		<view class="page-layer">

		</view>
	</view>
</template>

<script>
	import mall from "../api/mall.js"
	export default {
		data() {
			return {
				// 订单产品表ID
				orderProductId: '',
				// 退款产品
				orderProduct: {},
				// 产品退款列表
				refundList: [],
			}
		},

		onLoad(options) {
			this.orderProductId = options.id || ''
		},

		onShow() {
			// 获取退款列表
			mall.refund.listOrderProductRefund(this.orderProductId).then(res => {
				if (res.code == 0) {
					this.refundList = res.data.refund_list
				}
			})
		},

		onReady() {
			// 获取退款产品
			mall.refund.getRefundProduct(this.orderProductId).then(res => {
				if (res.code == 0) {
					this.orderProduct = res.data.order_product
				}
			})
		},

		methods: {

		}
	}
</script>
<style scoped>

</style>